<template>
    <div style="padding:20px;">
        <div class="modal-content">
        <Tabs value="0">
          <TabPane label="风险信息" name="0">
            <Form :show-message="false" label-position="top" >
              <Row :gutter="20">
                <Col span="12">
                  <FormItem label="公司名称">
                    <Input class="width90" v-model.trim="detailData.orgName" readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="项目名称" >
                    <Input class="width90" v-model.trim="detailData.proName" readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="工点名称">
                    <Input class="width90" v-model.trim="detailData.pointName" readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="工点风险等级">
                    <Input class="width90" v-model.trim="detailData.distRiskGradeName"  readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="起始时间">
                    <Input class="width90" v-model.trim="detailData.startTime" readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="结束时间">
                    <Input class="width90" v-model.trim="detailData.endTime" readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="当月是否作业">
                    <Input class="width90" v-model.trim="detailData.isWorkedThisMonth" readonly/>
                  </FormItem>
                </Col>
                <Col span="24">
                  <FormItem label="工点描述">
                    <Input style="width: 95%" type="textarea" v-model.trim="detailData.note" readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="作业风险名称">
                    <Input class="width90" v-model.trim="detailData.riskOperationName"  readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="作业风险类型">
                    <Input class="width90" v-model.trim="detailData.riskCategoryNames" readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="作业风险等级">
                    <Input class="width90" v-model.trim="detailData.riskLevelName" readonly/>
                  </FormItem>
                </Col>
                <Col span="12">
                  <FormItem label="分级方法">
                    <Input class="width90" v-model.trim="detailData.classificationMethodName" readonly/>
                  </FormItem>
                </Col>
                <Col span="24">
                  <FormItem label="具体风险描述">
                    <Input style="width: 95%" type="textarea" v-model.trim="detailData.riskDescription" readonly/>
                  </FormItem>
                </Col>
                <Col span="24">
                  <FormItem label="工程公司管控要求">
                    <Input style="width: 95%" type="textarea" v-model.trim="detailData.riskControlRequirementOne" readonly/>
                  </FormItem>
                </Col>
                <Col span="24">
                  <FormItem label="集团公司管控要求">
                    <Input style="width: 95%" type="textarea" v-model.trim="detailData.riskControlRequirementTwo" readonly/>
                  </FormItem>
                </Col>
                <Col span="24">
                  <FormItem label="目前该风险安全控制情况">
                    <Input style="width: 95%" type="textarea" v-model.trim="detailData.riskControlDetailOne" readonly/>
                  </FormItem>
                </Col>
              </Row>
            </Form>
          </TabPane>
          <TabPane label="措施信息" name="1">
            <Table
              border
              ref="selection"
              :columns="columns2"
              :data="measuresList"
            >
            </Table>
          </TabPane>
          <TabPane label="审核进度" name="2">
            <!--<div class="process-recent">{{ processModel.yourMessage }}</div>-->
            <Timeline>
              <TimelineItem
                color="blue"
                v-for="(item, index) in recordList"
                :key="index"
              >
                <Icon type="ios-radio-button-on" slot="dot" />
                <div class="process-container">
                  <h4 class="process-title">
                    {{ item.titleName }}：<span
                    :class="'通过' == item.result ? 'audit--success' : 'audit--danger'"
                  >{{ item.result }}</span
                  >
                  </h4>
                  <div class="process-list">
                    <Row
                      :gutter="32"
                      type="flex"
                      v-for="(row, innerIndex) in item.recordList"
                      :key="innerIndex"
                    >
                      <Col :md="8" :lg="5" :xl="4" :xxl="3">
                        <span class="process-name">{{ row.operatorName }}</span>
                        <span class="process-position" v-if="row.operatorPost">
                      （{{ row.operatorPost }}）
                    </span>
                      </Col>
                      <Col>
                        于
                      </Col>
                      <Col>
                        <strong>{{ row.operationTime }}</strong>
                      </Col>
                      <Col>
                        <span v-if="index > 0">进行</span>
                        <strong>{{ row.serviceTypeName }}</strong>
                      </Col>
                      <Col>
                        {{ row.serviceTypeName }}<strong
                        :class="
                        1 == row.operationResult ? 'audit--success' : 'audit--danger'
                      "
                      >{{ row.operationResultName }}</strong
                      >
                      </Col>
                      <Col v-if="index > 0"
                      >并填写说明：<span>{{ row.comment }}</span>
                      </Col>
                    </Row>
                  </div>
                  <div class="process-angle"></div>
                </div>
              </TimelineItem>
            </Timeline>
          </TabPane>
          <TabPane label="问询回复" name="3">
            <replyInquiries :businessType="businessType" :editModel="detailData"></replyInquiries>
          </TabPane>
        </Tabs>
      </div>
      <span class="inquiries" @click="replyChild()">回复</span>
      </div>
</template>
<script>
import replyInquiries from '../../components/modules/inquiries/replyInquiries'
export default {
    components:{
        replyInquiries,
    },
    data(){
        return{
            businessType:'businesstype_dynamics',
            detailData:{},
            measuresList:[],
            recordList:[],
            columns2:[
                {
                    title: '序号',
                    type: 'index',
                    align: 'center',
                    width: 70
                },
                {
                    title: '管控措施',
                    key: 'measures',
                    align: 'center',
                    width:100,
                },
                {
                    title: '项目部管控责任人',
                    key: 'projectManagementDepartmentName',
                    align: 'center',
                },{
                    title: '项目部分管领导',
                    key: 'projectManagementLeaderName',
                    align: 'center',
                },{
                    title: '项目部主管领导',
                    key: 'leaderInChargeOfProjectDepartmentName',
                    align: 'center',
                },{
                    title: '工程公司管理人员',
                    key:'controlDepartmentOfEngineeringCompanyName',
                    align: 'center',
                },{
                    title: '工程公司分管领导',
                    key:'leaderInChargeOfEngineeringCompanyName',
                    align: 'center',
                },{
                    title: '集团公司管理人员',
                    key:'groupCompanyControlDepartmentName',
                    align: 'center',
                },{
                    title: '集团公司分管领导',
                    key:'leaderInChargeOfGroupCompanyName',
                    align: 'center',
                },{
                    title: '措施类型',
                    key:'measureTypeName',
                    align: 'center',
                    width:100,
                },{
                    title: '频次',
                    key:'frequencyName',
                    align: 'center',
                }
            ],
        }
    },
    mounted(){
        this.destroyBtn()
    },
    methods:{
        destroyBtn(){//详情
            this.$api.MonthlyDynamics.getDynamicRiskOrderdetailsecond(this.$route.query.objectId).then(res => {
                if(res.code === 200){
                    this.isReply = true
                    this.detailData = res.data
                    this.detailData.startTime = this.$time(new Date(this.detailData.startTime),'yyyy-MM-dd')
                    this.detailData.endTime = this.$time(new Date(this.detailData.endTime),'yyyy-MM-dd')
                    this.measuresList = res.data.measuresList;
                    this.recordList = res.data.recordList;
                    if(this.recordList){
                        this.recordList.map(value => {
                            value.operationTime = this.$time(new Date(value.operationTime),'yyyy-MM-dd hh:mm:ss')
                        })
                    }
                }else {
                    this.$Message.warning(res.message)
                }
            })
        },
        replyChild(){
            let self = this
            self.$router.push({
                name: `replyInquiries-detail`,
                query:{
                    source:1,
                    businessType:self.$route.query.businessType,
                    objectId:self.$route.query.objectId,
                    id:self.$route.query.id,
                    riskName:self.$route.query.riskName
                }
            })
        }
    }
}
</script>